<template>
    <div>

        <!--顶栏-->
        <el-row>
            <el-col :span="24" class="title_area">
                <h4>管理员列表</h4>
                <el-breadcrumb separator="/">
                    <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
                    <el-breadcrumb-item>新闻列表</el-breadcrumb-item>
                </el-breadcrumb>
            </el-col>
        </el-row>

        <!--搜索栏-->
        <div class="search_panel">
            <el-row>
                <el-col :span="8">
                    <el-input v-model="name" placeholder="请输入姓名"></el-input>
                </el-col>
                <el-col :span="6">
                    <el-button type="primary"  class="btn_login" @click="managerList"><i class="el-icon-search"></i>查询</el-button>
                </el-col>
            </el-row>
        </div>

        <!--列表-->
        <el-table :data="tableData"  border style="width: 100%;margin-top: 20px">
            <el-table-column prop="name" label="管理员姓名"></el-table-column>
            <el-table-column prop="login_time" label="登录时间"></el-table-column>
            <el-table-column prop="created_at" label="创建时间" ></el-table-column>
            <el-table-column prop="updated_at" label="修改时间" ></el-table-column>
            <!--<el-table-column  label="操作" width="200">-->
            <!--<template scope="scope">-->
            <!--<el-button  type="default" size="small" @click="deleteNews(scope.$index,tableData)">删除</el-button>-->
            <!--</template>-->
            <!--</el-table-column>-->
        </el-table>

        <!--分页-->
        <el-pagination
                background
                layout="prev, pager, next"
                pagesize="20"
                :total="pagination.total_pages">
        </el-pagination>

    </div>
</template>
<script>

  export default {
    data() {
      return {
        className:'right',
        tableData:[],
        name: '',
        pagination: {
          total: 20,
          count: 20,
          current_page: 1,
          total_pages: 1
        },
        total_pages: 100
      }
    },
    components: {

    },

    created() {
      this.managerList()
    },

    methods: {
      changeRight(value) {
        this.className = value
      },

      managerList() {
        let params = {
          name: this.name
        }

        this.$store.dispatch('getManager', params).then((ret) => {
          this.tableData = ret.data.managers.data
          this.pagination.pagination  = ret.data.managers.meta.pagination
        })

      }
    }
  }
</script>
<style scoped>
    .header { background: #f2f2f2; }
</style>
